import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:richedit/convert/convert.dart';
import 'package:richedit/data/text_entity.dart';

class TextEdit extends StatefulWidget {
  TextEntity textData;

  TextEdit(this.textData);

  @override
  _TextEditState createState() => _TextEditState();
}

class _TextEditState extends State<TextEdit> {
  late TextEditingController _editingController;

  @override
  void initState() {
    _editingController =
        TextEditingController(text: widget.textData.data ?? "");
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    TextAlign align;
    if (widget.textData.align == "2"){
      align = TextAlign.right;
    }else if (widget.textData.align == "1"){
      align = TextAlign.center;
    }else {
      align = TextAlign.justify;
    }
    return Padding(
      padding: const EdgeInsets.symmetric(horizontal: 8),
      child: TextField(
        keyboardType: TextInputType.multiline,
        maxLines: null,
        controller: _editingController,
        textAlign: align,
        style: TextStyle(
          color: widget.textData.color == null
              ? Colors.black87
              : Convert.parseColor(widget.textData.color),
          fontSize: widget.textData.fontSize == null
              ? 14
              : double.parse(widget.textData.fontSize!),
          fontWeight: widget.textData.bold == true
              ? FontWeight.bold
              : FontWeight.normal,
          fontStyle: widget.textData.italic == true
              ? FontStyle.italic
              : FontStyle.normal,
        ),
        onChanged: (text) {
          widget.textData.data = text;
        },
        decoration: InputDecoration(
            contentPadding: const EdgeInsets.all(10),
            border: OutlineInputBorder(
              borderRadius: BorderRadius.circular(8),
            )),
      ),
    );
  }
}

class TextPreview extends StatefulWidget {
  TextEntity textData;

  TextPreview(this.textData);

  @override
  _TextPreviewState createState() => _TextPreviewState();
}

class _TextPreviewState extends State<TextPreview> {
  @override
  Widget build(BuildContext context) {
    TextAlign align;
    if (widget.textData.align == "2"){
      align = TextAlign.right;
    }else if (widget.textData.align == "1"){
      align = TextAlign.center;
    }else {
      align = TextAlign.justify;
    }
    return Container(
      width: double.infinity,
      padding:  const EdgeInsets.symmetric(horizontal: 8),
      child: Text(
        widget.textData.data ??"",
        textAlign: align,
        style: TextStyle(
          color: widget.textData.color == null
              ? Colors.black87
              : Convert.parseColor(widget.textData.color),
          fontSize: widget.textData.fontSize == null
              ? 14
              : double.parse(widget.textData.fontSize!),
          fontWeight: widget.textData.bold == true
              ? FontWeight.bold
              : FontWeight.normal,
          fontStyle: widget.textData.italic == true
              ? FontStyle.italic
              : FontStyle.normal,
        ),
      ),
    );
  }
}

class TextSetting extends StatefulWidget {
  TextEntity data;
  ValueChanged onChanged;
  TextSetting(this.data, this.onChanged);

  @override
  _TextSettingState createState() => _TextSettingState();
}

class _TextSettingState extends State<TextSetting> {
  @override
  Widget build(BuildContext context) {
    return Container(
      width: double.infinity,
      padding: const EdgeInsets.all(16),
      decoration: BoxDecoration(
        borderRadius: BorderRadius.only(
            topLeft: Radius.circular(8), topRight: Radius.circular(8)),
        color: Colors.white,
      ),
      child: Column(
        mainAxisSize: MainAxisSize.min,
        children: [
          Row(
            children: [
              Text("颜色：", style: TextStyle(fontSize: 16),),
              colorWidget(Colors.black87),
              colorWidget(Colors.red),
              colorWidget(Colors.grey),
              colorWidget(Colors.blue),
              colorWidget(Colors.orange),
              colorWidget(Colors.purple),
            ],
          ),
          Row(
            children: [
              Text("字号：", style: TextStyle(fontSize: 16),),
              sizeWidget("12"),
              sizeWidget("14"),
              sizeWidget("16"),
              sizeWidget("18"),
              sizeWidget("20"),
              sizeWidget("30"),
            ],
          ),
          Row(
            children: [
              Text("对齐："),
              alignWidget("0"),
              alignWidget("1"),
              alignWidget("2"),
            ],
          ),
          Row(
            children: [
              Text("粗体："),
              CupertinoSwitch(value: widget.data.bold??false, onChanged: (value){
                setState(() {
                  widget.data.bold = value;
                });
                widget.onChanged(widget.data);
              }),
              Text("斜体："),
              CupertinoSwitch(value: widget.data.italic ?? false, onChanged: (value){
                setState(() {
                  widget.data.italic = value;
                });
                widget.onChanged(widget.data);
              })
            ],
          ),

        ],
      ),
    );
  }
  Widget colorWidget(Color color){
    return GestureDetector(
      onTap: (){
        widget.data.color = Convert.color2String(color);
        setState(() {
          widget.onChanged(widget.data);
        });
      },
      child: Container(
        width: 36,
        height: 36,
        margin: const EdgeInsets.all(5),
        decoration: BoxDecoration(
          color: color,
          border: Border.all(color: Colors.blue, width: Convert.parseColor(widget.data.color).value == color.value ? 2 : 0),
        ),
      ),
    );
  }
  
  Widget sizeWidget(String fontSize){
    return GestureDetector(
      onTap: (){
        widget.data.fontSize = fontSize.toString();
        setState(() {
          widget.onChanged(widget.data);
        });
      },
      child: Container(
        width: 36,
        height: 36,
        margin: const EdgeInsets.all(5),
        decoration: BoxDecoration(
          border: Border.all(color: Colors.blue, width: widget.data.fontSize == fontSize ? 2 : 1),
        ),
        child: Center(child: Text(fontSize)),
      ),
    );
  }
  Widget alignWidget(String align){
    String alignStr;
    if (align == "0"){
      alignStr = "居左";
    }else if(align == "1"){
      alignStr = "居中";
    }else{
      alignStr = "居右";
    }
    return GestureDetector(
      onTap: (){
        widget.data.align = align;
        setState(() {
          widget.onChanged(widget.data);
        });
      },
      child: Container(
        width: 36,
        height: 36,
        margin: const EdgeInsets.all(5),
        decoration: BoxDecoration(
          border: Border.all(color: Colors.blue, width: widget.data.align == align ? 2 : 1),
        ),
        child: Center(child: Text(alignStr)),
      ),
    );
  }
}


Future<TextEntity?> showTextSetting(BuildContext context, TextEntity data, ValueChanged onChanged){
  data.bold ??= false;
  data.italic ??= false;
  return showModalBottomSheet( context: context,
  backgroundColor: Colors.transparent,
  builder: (context) {
    return TextSetting(data, onChanged);
  });
}
